<%@ page language="java" pageEncoding="UTF-8"%>
<%@ include file="/jsp/common/common.jspf"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="${base }/css/common.css" />
<link rel="stylesheet" type="text/css" href="${base }/js/plugins/formValidator/validator.css" />
<script type="text/javascript" src="${base }/js/jquery-1.7.min.js"></script>
<script type="text/javascript" src="${base }/js/plugins/formValidator/formValidatorRegex.js"></script>
<script type="text/javascript" src="${base }/js/plugins/formValidator/formValidator.js"></script>
<title>用户注册</title>
</head>
<body>
	<center><h2>用户注册</h2></center>
	<form id="_regForm" method="post" class="register">
		<table>
			<tr>
				<td>用户名：</td>
				<td><input type="text" name="regname" id="regname" class="text-input" /></td>
				<td><div id="regnameTip" style="width:220px"></div></td>
			</tr>
			<tr>
				<td>姓名：</td>
				<td><input type="text" name="name" id="name" class="text-input" /></td>
				<td><div id="nameTip" style="width:220px"></div></td>
			</tr>
			<tr>
				<td>邮箱：</td>
				<td><input type="text" name="email" id="email" class="text-input" /></td>
				<td><div id="emailTip" style="width:220px"></div></td>
			</tr>
			<tr>
				<td>密码：</td>
				<td><input type="password" name="password" id="password" class="text-input" /></td>
				<td><div id="passwordTip" style="width:220px"></div></td>
			</tr>
			<tr>
				<td>确认密码：</td>
				<td><input type="password" name="password2" id="password2" class="text-input" /></td>
				<td><div id="password2Tip" style="width:220px"></div></td>
			</tr>
			<tr>
				<td>验证码：</td>
				<td><input type="text" name="check" id="check" class="text-input-h" />&nbsp;<img id="chkimg" border=0 width=60 height=20 style="cursor:hand" onclick="this.src='${base }/checkCode/'+ Math.random()" alt="看不清?点一下" /></td>
				<td>&nbsp;<div id="checkTip" style="width:220px"></div></td>
			</tr>
			<tr>
				<td><input type="submit" id="btn_reg" value="注 册" /></td>
				<td>
					<input type="button" value="重 填" onclick="_clear();" />
					<input type="button" value="登 陆" style="margin-left: 12px;" onclick="javascript:window.location.href='${base }/user_login';" />
				</td>
				<td></td>
			</tr>
			<tr>
				<td colspan="3" class="required">${message }</td>
			</tr>
		</table>
	</form>
	<script>
		$(document).ready(function() {
			$("#chkimg").attr("src", "${base }/checkCode/" + Math.random());
			$.formValidator.initConfig({
				formID:'_regForm',
				debug:false,
				submitOnce:true,
				onError:function(msg,obj,errorlist){
					alert(msg);
				},
				submitAfterAjaxPrompt : '有数据正在异步验证，请稍等...'
			});
			$("#regname").formValidator({onShow:"请输入用户名",onFocus:"用户名至少1个字符，最多20个字符",onCorrect:"该用户名可以注册",onempty:"用户名不能为空"}).inputValidator({min:1,max:20,onError:"你输入的用户名不符合要求"})
					     .ajaxValidator({
							dataType : "html",
							async : true,
							type : "POST",
							url : "${base }/user_exists",
							success : function(data) {
								if (data.indexOf("1") > 0) {
									return true;
								} else {
									return false;
								}
								return false;
							},
							buttons: $("#btn_reg"),
							error: function(jqXHR, textStatus, errorThrown){alert("服务器没有返回数据，可能服务器忙，请重试" + errorThrown);},
							onError : "该用户名不可用，请更换用户名",
							onWait : "正在对用户名进行合法性校验，请稍候..."
			});
			$("#name").formValidator({onShow:"请输入姓名",onFocus:"至少1个字符，最多20个字符",onCorrect:"输入正确"}).inputValidator({min:1,max:20,onError:"你输入的姓名不符合要求"});
			$("#password").formValidator({onShow:"请输入密码",onFocus:"至少1个字符",onCorrect:"输入正确"}).inputValidator({min:1,empty:{leftEmpty:false,rightEmpty:false,emptyError:"密码两边不能有空符号"},onError:"密码不能为空"});
			$("#password2").formValidator({onShow:"请输入确认密码",onFocus:"至少1个字符",onCorrect:"密码与确认密码一致"}).inputValidator({min:1,empty:{leftEmpty:false,rightEmpty:false,emptyError:"确认密码两边不能有空符号"},onError:"确认密码不能为空"}).compareValidator({desID:"password",operateor:"=",onError:"密码与确认密码不一致,请确认"});
			$("#email").formValidator({onShow:"请输入邮箱",onFocus:"邮箱6-40个字符",onCorrect:"输入正确",defaultValue:"@"}).inputValidator({min:1,max:40,onError:"你输入的邮箱长度非法"}).regexValidator({regExp:"^([\\w-.]+)@(([[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.)|(([\\w-]+.)+))([a-zA-Z]{2,4}|[0-9]{1,3})(]?)$",onError:"你输入的邮箱格式不正确"});
			$("#check").formValidator({onShow:"请输入验证码",onFocus:"验证码为4个字符",onCorrect:"验证码输入正确"}).inputValidator({min:1,max:4,onError:"验证码只能为4个字符"})
			  	       .ajaxValidator({
							dataType : "html",
							async : true,
							type : "POST",
							url : "${base }/user_checkCode",
							success : function(data) {
								if (data.indexOf("1") > 0) {
									return true;
								} else {
									return false;
								}
								return false;
							},
							buttons: $("#btn_reg"),
							error: function(jqXHR, textStatus, errorThrown){alert("服务器没有返回数据，可能服务器忙，请重试" + errorThrown);},
							onError : "验证码不正确，请重新输入",
							onWait : "正在验证验证码是否正确，请稍候..."
			});
		});
	
		function _clear() {
			$("input[type='text']").each(function() { $(this).val(""); });
			$(":password").each(function() { $(this).val(""); });
		}
	</script>
</body>
</html>